let $gotoDlg = (function() {
  let html = `
    <div class="notepad-dlg-goto">
      <div class="notepad-dlgbox">
        <div class="titlebar">
          <p class="title">转到指定行</p>
          <span class="close-btn">×</span>
        </div>
        <div class="main">
          <label>行号(<u>L</u>):</label>
          <br>
          <input class="txt-line-num" type="text" autofocus>
          <br>
          <input class="btn-goto" type="button" value="转到">
          <input class="btn-cancel" type="button" value="取消">
        </div>
      </div>
    </div> `;



  //设计时，运行时
  let $dlg = $(html),
      cfg = {
        container: 'body',
        title:     '同意',
        delay:     6,
        enabled:   false,
        onClick:   null
      },
      timer = null;

  function destroy() {
    $dlg.remove();
  }

  var $btnClose = $dlg.find('.close-btn'),
      $titleBar = $dlg.find('.titlebar');



  function show(config) {
    //gen dom
    //$.extend(cfg,config);
    $('body').append($dlg);
    $dlg.find('.notepad-dlgbox').draggable({handle: $titleBar});

    $btnClose.click(destroy);

    
    //event bind
     
  }



  return {
    show,destroy
  }
})();

/*UI组件得面向对象封装，两种方式
  1. {} Object
  let $timerBtn = {
    show:function() {}
  };

  2. 工厂函数（匿名函数的立即执行表达式 + 闭包）
  封装：
  let $timerBtn = (function() {
    //...
    //
    function show() {

    }

    return {
      show
    }
  })();
  使用：
  $tiemrBtn.show();

  3. 构造函数
  function TimerBtn() {

    this.show = function() {}
  }

  使用：
  let btn = new TimerBtn();
  btn.show();
*/
